---
title: "Overview"
description: "Nuxt module for unkey"
---

If you are using Nuxt, you can benefit from an almost zero-config experience with the `@unkey/nuxt` module.

## Install

<CodeGroup>

```bash npm
npm install @unkey/nuxt
```

```bash pnpm
pnpm add @unkey/nuxt
```

```bash yarn
yarn add @unkey/nuxt
```

```bash bun
bun install @unkey/nuxt
```

</CodeGroup>

## Configuration

`@unkey/nuxt` just requires your root key. Create an `.env` file in your project and add the following:

```env
NUXT_UNKEY_TOKEN=<your api key>
```

This can also be configured at runtime by setting the `NUXT_UNKEY_TOKEN` environment variable.

From this point onward, `@unkey/nuxt` will automatically:

1. verify any API requests with an `Authorization: Bearer xxx` header.
1. register a `useUnkey()` helper that allows access to an automatically configured unkey instance.

## Usage

### Automatic verification

You can access the automatically-verified `unkey` context on the server with `event.context.unkey` in your server routes or `useRequestEvent().context.unkey` in the Vue part of your app.

For example:

<Tabs>
  <Tab title="~/server/api/test.ts">
    ```ts
    export default defineEventHandler(async (event) => {
      if (!event.context.unkey.valid) {
        throw createError({ statusCode: 403, message: "Invalid API key" })
      }

      // return authorised information
      return {
        // ...
      };
    });
    ```

  </Tab>
  <Tab title="~/app.vue">
    ```html
    <template>
      <div>
        <pre>Was verified: {{ wasVerified }}</pre>
      </div>
    </template>

    <script setup>
    const wasVerified = useState(() => ({ unkey: useRequestEvent()?.context?.unkey.valid }))
    </script>
    ```

  </Tab>
</Tabs>

## Unkey helper

For more about how to use the configured helper provided by `useUnkey()`, you can see the API docs for [the TypeScript client](/libraries/ts/api).

For example:

```ts
const unkey = useUnkey();

const created = await unkey.keys.create({
  apiId: "api_7oKUUscTZy22jmVf9THxDA",
  prefix: "xyz",
  byteLength: 16,
  ownerId: "chronark",
  meta: {
    hello: "world",
  },
  expires: 1686941966471,
  ratelimit: {
    async: true,
    duration: 1000,
    limit: 10,
    refillRate: 1,
    refillInterval: 1000,
  },
});

console.log(created.key);
```


### Disable telemetry

By default, Unkey collects anonymous telemetry data to help us understand how our SDKs are used.

If you wish to disable this, you can do so by passing a boolean flag to the constructor:

```ts
const unkey = useUnkey({ disableTelemetry: true })
```
